<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>增加小程序信息</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="../../../../component/elementUI/index.css">
  <link rel="stylesheet" href="../../../../style/index.css">
</head>

<body>
  <div id="app" class="minWidth">
    <el-form ref="form" :rules="rules" :model="integral_scheme" inline-message="true" style="width: 100%">
      <!--  -->
      <div class="table_titel">
        <div class="titel">执行时间</div>
      </div>
      <el-descriptions :column="3" border size="">
        <el-descriptions-item label="开始时间">
          <el-form-item label="" prop="Start_Date">
            <el-date-picker v-model.trim="integral_scheme.Start_Date" type="datetime" placeholder="请选择开始时间"
              value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
          </el-form-item>
        </el-descriptions-item>
        <el-descriptions-item label="结束时间">
          <el-form-item label="" prop="End_Date">
            <el-date-picker v-model.trim="integral_scheme.End_Date" type="datetime" placeholder="请选择开始时间"
              value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
          </el-form-item>
        </el-descriptions-item>
      </el-descriptions>
      <!--  -->
      <div class="table_titel">
        <div class="titel">适用身份</div>
        <div class="operation">
          <el-button type="primary" size="small" @click="add_ii_Applicable_identity">新增</el-button>
          <el-button type="danger" size="small" @click="remove_ii_Applicable_identity">删除</el-button>
        </div>
      </div>
      <el-descriptions :column="3" border size="small"
        v-for="(item,index) in integral_scheme.Children.integral_scheme_detail" :key="index">
        <el-descriptions-item label="适用会员身份">
          <el-form-item :rules="Member_Rights_SerialNumber"
            :prop="'Children.integral_scheme_detail.' + index + '.Member_Rights_SerialNumber'">
            <el-select v-model="item.Member_Rights_SerialNumber">
              <el-option v-for="(item,index) in Vip_identity_list" :key="index" :label="item.Member_Rights_Name"
                :value="item.Member_Rights_SerialNumber"></el-option>
            </el-select>
            <!-- <el-input v-model="item.Member_Rights_SerialNumber" placeholder="请输入适用会员身份"></el-input> -->
          </el-form-item>
        </el-descriptions-item>
        <el-descriptions-item label="是否开启多倍积分日">
          <el-form-item>
            <el-radio-group v-model="item.Integral_Day">
              <el-radio label="1" value="1">是</el-radio>
              <el-radio label="0" value="0">否</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-descriptions-item>
        <el-descriptions-item label="积分倍率">
          <el-form-item :rules="Integral_Day_Magnification"
            :prop="'Children.integral_scheme_detail.' + index + '.Integral_Day_Magnification'">
            <el-input v-model="item.Integral_Day_Magnification" placeholder="请输入积分倍率"></el-input>
          </el-form-item>
        </el-descriptions-item>
        <el-descriptions-item label="生效日期">
          <el-form-item style="width: 300px;" :rules="time_list"
            :prop="'Children.integral_scheme_detail.' + index + '.time_list'">
            <el-date-picker v-model="item.time_list" type="daterange" value-format="yyyy-MM-dd HH:mm:ss"
              range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" @change="time(item,$event)">
            </el-date-picker>
          </el-form-item>
        </el-descriptions-item>
        <el-descriptions-item label="积分类别">
          <el-form-item :rules="Integral_Type_SerialNumber"
            :prop="'Children.integral_scheme_detail.' + index + '.Integral_Type_SerialNumber'">
            <el-select placeholder="请选择适用类别" @change="integral_type_methods" v-model="item.Integral_Type_SerialNumber">
              <el-option v-for="(item2,index2) in integral_type" :key="index2" :label="item2.Integral_Type_Name"
                :value="item2.Integral_Type_SerialNumber"></el-option>
            </el-select>
          </el-form-item>
        </el-descriptions-item>
        <el-descriptions-item label="">
          <el-form-item prop="integral_type_index">
            <el-select v-model="integral_type_index">
              <!-- <el-option label="用户每消费赠积分" :value="integral_type_method.Gift_Point"></el-option> -->
              <!-- 用户每消费赠积分 -->
              <!-- <el-option label="用户消费满赠积分" :value="integral_type_method.Every_Gift_Point"></el-option> -->
              <!--用户消费满赠积分  -->
            </el-select>
          </el-form-item>
        </el-descriptions-item>
      </el-descriptions>
      <!-- 适用店铺 -->
      <div class="table_titel">
        <div class="titel">适用店铺</div>
        <div class="operation">
          <el-button type="primary" size="small" @click="add_ii_Applicable_shop">新增</el-button>
          <el-button type="danger" size="small" @click="remove_ii_Applicable_shop">删除</el-button>
        </div>
      </div>
      <el-descriptions :column="3" border size=""
        v-for="(item,index) in integral_scheme.Children.integral_scheme_storescope" :key="index">
        <el-descriptions-item label="适用店铺">
          <el-form-item :rules="Store_SerialNumber"
            :prop="'Children.integral_scheme_storescope.'+ index +'.Store_SerialNumber'">
            <el-select v-model="item.Store_SerialNumber" placeholder="请选择适用店铺">
              <el-option v-for="(item,index) in in_store_info" :key="index" :label="item.Store_Name"
                :value="item.Store_SerialNumber"></el-option>
            </el-select>
          </el-form-item>
        </el-descriptions-item>
      </el-descriptions>
      <!--适用商品  -->
      <div class="table_titel">
        <div class="titel">适用商品</div>
      </div>

      <el-descriptions :column="1" border size="">
        <el-descriptions-item label="商品分类方式">
          <el-form-item prop="pp">
            <el-select placeholder="请选择商品分类方式" v-model="pp" @change="commodity">
              <el-option label="品牌" value="category"></el-option>
              <el-option label="种类" value="brand"></el-option>
            </el-select>
          </el-form-item>
        </el-descriptions-item>
        <el-descriptions-item label="适用商品类(可多选)">
          <el-form-item prop="zhongli">
            <el-select multiple v-model="zhongli" @change="article_info_methods">
              <el-option v-for="(item,index) in commodityNum" :key="index" :label="item.Category_Name"
                :value="item.Category_SerialNumber"></el-option>
            </el-select>
          </el-form-item>
        </el-descriptions-item>
      </el-descriptions>

      <div class="table_titel">
        <div class="titel">商品预览</div>
      </div>

      <el-table
        :data="integral_scheme.Children.integral_scheme_article.slice((form.page-1)*form.limit,form.page*form.limit)"
        style="width: 100%" :header-cell-style="{ 'text-align': 'center' }" :cell-style="{ 'text-align': 'center' }">
        <el-table-column prop="Picture_URL" label="图片" width="200" height="200">
          <template slot-scope="{row}">
            <img :src="DomainIMG + row.Picture_URL" alt="" style="width: 100%; height: 100%;">
          </template>
        </el-table-column>
        <el-table-column prop="Article_Name" label="商品名称">
        </el-table-column>
        <el-table-column label="操作">
          <template slot-scope="{row}">
            <el-button size="mini" type="danger" @click="handleDelete(row)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>

      <div class="foot">
        <el-pagination background v-show="total > 0" @size-change="handleSizeChange"
          @current-change="handleCurrentChange" :current-page="form.page" :page-sizes="[10,20,30,50]"
          :page-size="form.limit" layout="total, sizes, prev, pager, next, jumper" :total="total">
        </el-pagination>
      </div>

      <el-form-item class="form-operation">
        <el-button @click="window.history.back()">返回</el-button>
        <el-button type="primary" @click="submitForm">提交</el-button>
        <!-- @click="submitForm('contract')" -->
      </el-form-item>

    </el-form>
  </div>
  <script type="text/javascript" src="../../../../utils/jquery-3.6.0.min.js"></script>
  <script type="text/javascript" src="../../../../utils/jquery.cookie.js"></script>
  <script type="text/javascript" src="../../../../utils/vue.min.js"></script>
  <script type="text/javascript" src="../../../../component/elementUI/index.js"></script>
  <script type="text/javascript" src="../../../../utils/utils.js"></script>
  <script type="text/javascript" src="../../../../utils/ID_Validity.js"></script>
  <script type="text/javascript" src="../../../../utils/compressor.js"></script>
  <script type="text/javascript" src="./js/Add.js"></script>
  <style>
    .time {
      display: flex;
      justify-content: space-around;
    }

    .line {
      text-align: center;
    }

    .foot {
      display: flex;
      margin: 10px 0 70px 0;
      justify-content: flex-end;
    }
  </style>
</body>

</html>